import type { Directive } from 'vue'
export  const vClickOutside: Directive = {
  /**
   * @param el 当前元素
   * @param binding 当前元素的指令参数
   * el.contains(event.target as Node) 判断当前元素是否包含点击事件的元素
   */
  mounted(el, binding) {
    el._clickOutside = (event: Event) => {
      if (!(el === event.target || el.contains(event.target as Node))) {
        binding.value(event)
      }
    }
    document.addEventListener('click', el._clickOutside)
  },
  unmounted(el) {
    document.removeEventListener('click', el._clickOutside)
  }
}